
<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title> 
	</head>

	<body>
		<form action="" method="post">
			<select name="" id="sheng">
			</select>
			<select name="" id="shi">
			</select>
			<select name="" id="qu">
			</select>
		</form>
		<script src="json2.js" type="text/javascript" charset="utf-8">
		</script>
		<script type="text/javascript">
			
			function fun1 () {
			var sheng=document.getElementById("sheng")	
			var shi=document.getElementById("shi")	
			var qu=document.getElementById("qu")
			for (var i=0;i<city.length;i++) {
				sheng.appendChild(new Option(city[i].name,city[i].type));
//				console.log(city[i].name,city[i].type)
			}
			sheng.onchange=function  () {
				var index = this.selectedIndex;
				shi.options.length = 0;
//				console.log(city[index].type)
				if (city[index].type==0) {
					shi.appendChild(new Option("请选择"))
			    	shi.appendChild(new Option(city[index].name))
				} else{
					for (var i=0;i<city[index].sub.length; i++) {
						shi.appendChild(new Option(city[index].sub[i].name))
					}
				}
			   
			}
			shi.onchange=function  () {
				var c=sheng.selectedIndex
				var index = this.selectedIndex;
				qu.options.length = 0;
				if (city[c].type==0) {
					for (var i=0;i<city[c].sub.length;i++) {
						qu.appendChild(new Option(city[c].sub[i].name))
					}
				}else{
					for (var i=0;i<city[c].sub[index].sub.length;i++) {
						qu.appendChild(new Option(city[c].sub[index].sub[i].name))
					}
				}
			}
			}
			fun1();
			

		</script>
	</body>

</html>